<template>
	<view style='padding:15px;'>
		<u--form :model="formSearch" ref="form1">
			<u-form-item label="机构" prop="depCodeParam" @click="showSelect = true;" labelWidth='150'>
				<u--input v-model="depCodeParam" placeholder="请选择机构" readonly>
				</u--input>

			</u-form-item>
			<u-form-item label="检查年份" prop="planYear" labelWidth='150' @click="showPicker = true;">
				<dyDate timeType='year' @getData='(date)=>{formSearch.planYear=date}'></dyDate>
			</u-form-item>
			<u-form-item label="检查月份" prop="planMonth" labelWidth='150' @click="showDate = true;">
				<ldSelect :multiple='true' :list='listDate' @confirm='(data)=>{month=data}'></ldSelect>
			</u-form-item>
		</u--form>
		<!-- 下拉选择 -->
		<qianziyuSelect :show="showSelect" type="radio" :dataLists="pickerList" placeholder="输入机构搜索"
			@cancel="showSelect=false" @submit="confirm" @search='search'></qianziyuSelect>
		<u-button style='margin:15px auto;width:80%;' type="primary" size="large" @click="btnSearch()">查询</u-button>
		<u-button style='margin:15px auto;width:80%;' type="primary" size="large" @click="btnReset()">重置</u-button>
	</view>
</template>
<script>
	import dyDate from '@/components/dy-Date/dy-Date.vue'
	import ldSelect from '@/components/ld-select/ld-select.vue'
	import qianziyuSelect from '@/components/qianziyu-select/qianziyu-select.vue'
	export default {
		components: {
			dyDate,
			ldSelect,
			qianziyuSelect
		},
		data() {
			return {
				formSearch: {
					depCodeParam: "",
					planYear: "",
					planMonth: []
				},
				month: "",
				depCodeParam: "",
				showSelect: false,
				showDate: false,
				showPicker: false,
				mode: 'range',
				pickerList: [],
				keyList: [],
				// selectList: [],
				listDate: [{
					value: 1,
					label: '一月'
				}, {
					value: 2,
					label: '二月'
				}, {
					value: 3,
					label: '三月'
				}, {
					value: 4,
					label: '四月'
				}, {
					value: 5,
					label: '五月'
				}, {
					value: 6,
					label: '六月'
				}, {
					value: 7,
					label: '七月'
				}, {
					value: 8,
					label: '八月'
				}, {
					value: 9,
					label: '九月'
				}, {
					value: 10,
					label: '十月'
				}, {
					value: 11,
					label: '十一月'
				}, {
					value: 12,
					label: '十二月'
				}, ],

			}
		},
		onLoad() {},
		mounted() {
			this.$api.getDeptTreeById(this.$store.state.userInfo.dept_id).then(res => {
				res.data.data.map(item => {
					this.pickerList.push({
						id: item.value,
						name: item.title
					})
					// selectList
					this.keyList.push({
						id: item.value,
						name: item.title
					})
				})
			})
		},
		methods: {
			// 查询
			btnSearch() {
				this.formSearch.planMonth = []
				this.month.split(',').forEach(key => {
					this.listDate.map(item => {
						if (key == item.label) {
							this.formSearch.planMonth.push(item.value)
						}
					})
				})

				this.formSearch.planMonth.sort()
				this.$goBack('./index?formSearch=' + encodeURIComponent(JSON.stringify(this.formSearch)), 5);
			},

			// 机构选择
			confirm(item) {
				this.depCodeParam = item.name
				this.formSearch.depCodeParam = item.id
				this.showSelect = false
			},

			search(keyword) {
				let arrList = []
				if (keyword == '') {
					this.pickerList = this.keyList
				} else {
					this.pickerList.forEach(item => {
						if (item.name.indexOf(keyword) != -1) {
							arrList.push(item)
						}
					})
					this.pickerList = arrList
				}

			},



			// 重置
			btnReset() {
				this.$refs.form1.resetFields()
			}



		}
	}
</script>

<style lang="scss" scoped>
</style>
